import React from 'react';
import { Menu, Icon } from 'antd';
import styles from './LeftSide.less';

const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;

const LeftSide = (props) => {
  return (
    <Menu style={{ border: 0 }} mode={props.mode} defaultSelectedKeys={['1']}>
      <SubMenu key="sub1" className={props.mode === 'inline' ? '' : styles.antitle} title={<span><Icon type="user" className={props.mode === 'inline' ? '' : styles.anticon} /><span className={props.mode === 'inline' ? '' : styles.navext}>用户管理</span></span>}>
        <Menu.Item key="1">
          <Icon type="user" /><span className="nav-text">用户</span>
        </Menu.Item>
        <Menu.Item key="2">
          <Icon type="user" /><span className="nav-text">角色</span>
        </Menu.Item>
        <Menu.Item key="3">
          <Icon type="user" /><span className="nav-text">权限</span>
        </Menu.Item>
      </SubMenu>
      <SubMenu key="sub2" className={props.mode === 'inline' ? '' : styles.antitle} title={<span><Icon type="team" className={props.mode === 'inline' ? '' : styles.anticon} /><span className={props.mode === 'inline' ? '' : styles.navext}>商品管理</span></span>}>
        <Menu.Item key="4">品牌</Menu.Item>
        <Menu.Item key="5">分类</Menu.Item>
        <MenuItemGroup title="规格分组">
          <Menu.Item key="11">规格一</Menu.Item>
          <Menu.Item key="22">规格二</Menu.Item>
        </MenuItemGroup>
      </SubMenu>
      <SubMenu key="6" className={props.mode === 'inline' ? '' : styles.antitle} title={<span><Icon type="file" className={props.mode === 'inline' ? '' : styles.anticon} /><span className={props.mode === 'inline' ? '' : styles.navext}>订单管理</span></span>}>
        <Menu.Item key="44">快递单</Menu.Item>
        <Menu.Item key="55">发货点</Menu.Item>
        <SubMenu key="sub3" title="收退款">
          <Menu.Item key="7">收款一</Menu.Item>
          <Menu.Item key="8">收款二</Menu.Item>
          <SubMenu key="sub33" title="退款">
            <Menu.Item key="74">退款 7</Menu.Item>
            <Menu.Item key="83">退款 8</Menu.Item>
          </SubMenu>
        </SubMenu>
      </SubMenu>
    </Menu>
  );
};

LeftSide.propTypes = {};

export default LeftSide;
